<!doctype html>
<html lang="en">
	<head>
		<meta charset= "utf-8"/>
		<title>Final Project - Space and Earth Exploration</title>
		<script src="scripts/SCORM_API_wrapper.js" language="javascript"></script>
		<script src="scripts/sessionstorage.1.4.js" language="javascript"></script>
		<script src="scripts/scripts.js" language="javascript"></script>
		<script src="scripts/hotspots.js" language="javascript"></script>
		<link href="styles/styles.css" rel="stylesheet" type="text/css"/>

	</head>
	
	<body onLoad="javascript:visitMoonpage1()">
		
			<div>
			<div><img  src="images/mastermindlogo1.png" width="230px" alt="The logo" title="The logo"/></div>
			</div><br>
					
				<header><img src="images/moon-header.png" alt="Moon Header" title="Moon Header"/></header><br/><br/>

				<nav id="navigation">
				    	<div class="barbuttons2"><a href= "home-page.html">Home</a></div>
	    				<div class="barbuttons2"><a href= "moon-page1.html">Moon</a></div>
	    				<div class="barbuttons2"><a href= "sun-page1.html">Sun</a></div>
						<div class="barbuttons2"><a href="earth-page1.html" >Earth</a></div>
						<div id="test-Link" ><a href="final-test.html"><strong>TEST</strong></a></div>   
				</nav><br/> <br/>
			
			<section>
				<div id="container">
					 <div id="leftBar">
					 	<div>
					 		<img src="images/moon2.png" width="160px" alt="Moon Image" title="Moon Image"/>
				 		</div><br/>
				
					   		<div id="hs3" onmouseover="javascript:showTextPage( 1 )"
					   		onmouseout="javascript:hideOutputPages()"><p><strong>Fun Facts</strong></p>
					   		</div>
						<div id="output2">
							<div id="output-box2">
								<p id="output-text2">asdf</p>
							</div>
						</div>
					  </div>
						
						<section>
				 			 <div id="content">
				    			<article id="objectives">
				    			<p><strong>Objectives:</strong><br/>In this section, students will learn important facts about the moon.  They will explore the moon’s structure and it’s relationship with the earth and the sun. The section will also explore the many phases of the moon and how the lunar eclipse works.
									
				    			</p>
				    			</article><br/>
				    			
				    			<article class="topic-main-page">
				    			<p><strong>Explore</strong> how the moon was created, it’s structure and it’s relationship to 
														the sun and earth...<a class="read-more" href="moon-page2.html">Read More</a>
				    			</p>
				    			</article><br/>
				    			
				    			<article class="topic-main-page">
				    			<p><strong>Explore</strong> the many phases of the moon and why you can only
										see certain parts of the moon during a 29 day cycle...<a class="read-more" href="moon-page3.html">Read More</a>
				    			</p>
				    			</article><br/>
				    			
				    			<article class="topic-main-page">
				    			<p><strong>Explore</strong> the moon and what causes a lunar eclipse...
										<a  class="read-more" href="moon-page4.html">Read More</a>
				    			</p>
				    			</article><br/>
								
								<article >
								<p id="objectives">TEMPERATURE ON THE MOON<br/>
								The temperature on the moon varies from -387 Fahrenheit at night, to 253 Fahrenheit during the day. This is because the moon has no atmosphere. It can’t keep heat in or keep the heat out.
								</p>
								</article>
								
				  			</div>
				  		</section>
				  	
					  <div id="rightBar2">
						
				  	    <aside>
							<header>
								<p id="aside-title-audio">Audio</p>
							</header>
								<audio id="narration2" controls="controls">
									<source src="audio/moonobjective.mp3" type="audio/mp3">
									<source src="audio/moonobjective.ogg"  type="audio/ogg">
								</audio><br/>
								
							<header>
								<p id="aside-title-audio">Transcript</p>
							</header>
							<div id="transcript">
									<p>The objective of this section is to learn important facts about the moon. 
									Explore the moon’s structure, the phases of the moon or learn what causes a lunar eclipse. 
									Please click on the “read more” link to learn more.
									</p>
							
							</div>
							</aside>
							</article>  
				  		</div>
				    				
					  
					  
					</div>
				 	
					<div id="footer"><br/>
					    <a class="movingButtons" href="moon-page2.html">Next</a>	  
					</div>
		
		</section>
		
	</body>

</html>